我正在使用D3库创建一些图表。它们被放置在一个View框中(参见下面“输出”下的片段)。View框允许响应式缩放。但是在某些分辨率下,线条要么消失,要么模糊/变粗。我认为这与它在这些分辨率下像素不完美有关,但我可能是错的。没有添加额外的样式,除了shape-rendering:crispEdges;JSthis.y=d3.scale.linear().rangeRound([this.height,0]);this.yAxis=d3.svg.axis().scale(this.y).tickSize(this.width).tickValues([0,25,50,75,100]).ti
我正在研究个人财务的可视化,以学习d3,感觉像是一个有用的项目。我已经设法按照我的意愿制作每个月的图表(每天+或减去)。现在我希望能够从一个月更改为下一个月。如果旧月份(更新前)的天数(又名数据点)比新月份(更新后)多,则此方法有效。如果旧数据点少于新数据点,则会在图表顶部添加额外的数据点。我将条形图中的每个数据点作为一个组添加(条形图本身、数据标签+日期标签)。我正在为每个新的一天向下翻译整个小组。我需要弄清楚的是,更新后我的数据点是多了还是少了,如果少了,我需要向下翻译新的数据点。你知道我的意思?这是我最初添加条形图的代码:bar=chart.selectAll("g").data
我想构建一个比例尺,将一系列连续整数(字符串中字符的索引)映射到另一个整数范围(像素,比如0-600)中的规则间隔。也就是说,我想尽可能有规律地将字符分配给像素,反之亦然,一个字符的长度不一定是另一个的倍数。例如,我希望将[0,1,2,3]映射到400像素0->0-991->100-1992->200-2993->300-399反之0-99->0100-199->1200-299->2300-399->3虽然对于0-4000到400像素的映射,我希望0-9->010-19->1etc.d3中对此使用的最佳比例是多少?一方面,如果元素数量很大,我担心离散尺度不会使用域被等分的事实并生成巨
我试图获得相同的行为WilLinssen'simplementation但在d3.js版本4上。我对版本4中的zoomapi很困惑。我在原始实现中所做的更改是:zoom.translate()替换为d3.zoomTransform(selection.node())并添加了适当的点:svg.attr("transform","translate("+t.x+","+t.y+")"+"scale("+t.k+")");这个:zoom.scale(iScale(t)).translate(iTranslate(t));替换为varfoo=iTranslate(t);zoom.transla
我在Angular2中的一个组件中遇到问题,因为“this”在我的一个组件中绑定(bind)到错误的上下文。我有其他组件没有发生此问题,但我看不出有什么区别。这是我的代码:组件:import{Component,Input}from'@angular/core';import{FilesService}from"./services/files.service";@Component({selector:'my-app',moduleId:module.id,templateUrl:'/app/views/app.html'})exportclassAppComponent{openF
我想画一个点,大约1秒后我想画下一个点。这是否可能:我已经试过了:functionsimulate(i){setTimeout(function(){drawPoint(vis,i,i);},1000);}for(vari=1;i不幸的是,这是行不通的。它只是立即绘制整条线。 最佳答案 这是行不通的,因为for循环将立即运行到结束,setTimeouts将被同时调度,所有函数将同时触发。取而代之的是,这样做:vari=1;(functionloop(){if(i++>200)return;setTimeout(function(){
我在堆栈中查看了不同的链接距离,似乎为了改变链接距离,您需要实现一个函数,然后传递该函数以动态分配链接距离:functionlinkDistance(d){returnd.distance;}然后我认为我可以传递给svg,但返回函数错误而不是现有的linkdistance或distancevarlink=svg.selectAll(".link").data(bilinks).enter().append("path").style("stroke","#6b7071")//gunmetalgreylink.attr("class","link").linkDistance(linkD
我在使用v4时遇到D3中的缩放功能问题。它抛出一个错误,指出zoom.translate未定义。我主要使用此答案中的以下代码d3focusonnodeonclick,这对v3非常有效。但是,由于我在使用v3时遇到问题,因为它对源和节点采用字符串形式(而不是索引)的数据有限制D3JSONfilewithsourceandindexasstringsratherthanindices,我切换到v4..linksline{stroke:#999;stroke-opacity:0.6;}.nodescircle{stroke:#fff;stroke-width:1.5px;}varsvg=d3
我正在使用Three.js。我有一组3D点(x,y,z)和一组面孔。一张脸由K个点组成。它既可以是凸的也可以是凹的。我在Three.js文档中找不到任何可以帮助我的东西。一种解决方案可能是对这些形状进行三Angular剖分,但到目前为止我还没有找到任何简单的3D三Angular剖分算法。另一个解决方案是做类似的事情:varpointsGeometry=newTHREE.Geometry();pointsGeometry.vertices.push(newTHREE.Vector3(10,0,0));pointsGeometry.vertices.push(newTHREE.Vector
我昨天才开始使用d3.js,但在完成我的工作时遇到了一些麻烦。现在我创建了一个带有两个y轴的图表,每个显示一些值,x轴显示日期。点击y轴上的值,我会显示相应的水平网格线。我的问题是,在放大或缩小或拖动时,网格线(水平和垂直)无法根据轴值正确缩放,它们根本就不动。我今天下午进行了很多搜索,找到了一些如何执行此操作的示例,但它们似乎都不适用于我已有的代码。我想,应该将逻辑添加到缩放行为中,但我不确定//xaxisgridlinesfunctionmake_x_gridlines(){returnd3.axisBottom(x).ticks(5)}//addtheXgridlinesletx